<template>
	<view class="content">

		<u-swiper :list="swipers" :height="360"  class="home_swiper"  indicatorMode="line" circular ></u-swiper>

		<view class="box">
			<view class="input-box" @click="toSearch">
				<uni-search-bar  placeholder="今天想吃点啥？" radius="10" disabled="true" cancelButton="none"></uni-search-bar>
			</view>
		</view>
		<view class="title-item">味觉的探寻之旅</view>
		<view class="main">
			<foodlist :menu="menu"></foodlist>
		</view>
	</view>
</template>

<script>
	import uniSearchBar from '@/components/uni/uni-search-bar/uni-search-bar.vue';
	import foodlist from '@/components/foodlist/foodlist.vue'


	import {
		cookbookList
	} from '@/api/ap_cookbook.js';

	import {
		banner_list
	} from '@/api/ap_banner.js';
	export default {
		components: {
			uniSearchBar,
			foodlist
		},
		data() {
			return {
				swipers: [],
				menu: [],
				
			}
		},
		onLoad() {
			this.getMenu()
			this.getBanner()

		},
		methods: {
			getBanner() {
				banner_list({}).then(res => {
					this.swipers = res.data.map((item) => {
						return item.picture
					})
				})
			},
			
			getMenu() {
				cookbookList({}).then(res => {
					this.menu = res.data;
				})

			},

			toSearch() {
				
				uni.navigateTo({
					url: "/pages/search/search"
				})
			}
		}
	}
</script>

<style lang="scss">
	.home_swiper{
		padding-top: 10rpx;
		padding-left: 10rpx;
		padding-right: 10rpx;
	}
	
	.title-item {
		font-size: 40upx;
		color: gray;
		text-align: center;
	}



</style>